<template>
  <div class="crump">
    <template v-for="(item, index) in navs">
      <a
        :href="item.link"
        :key="index"
        :class="{ active: index == navs.length - 1 }"
        >{{ item.name }}</a
      >
      <template v-if="index != navs.length - 1"> / </template>
    </template>
  </div>
</template>

<script>
export default {
  props: ["navs"],

  data() {
    return {};
  },

  mounted() {},

  methods: {},
};
</script>
<style lang="less" scoped>
.crump {
  height: 40px;
  line-height: 40px;
  color: #666;
  a {
    text-decoration: none;
    color: #666;
    padding: 0 10px;
    &.active {
      color: #000;
      font-weight: bold;
    }
  }
}
</style>